// 1. 引入 Vue
import Vue from "vue";
// 2. 引入 VueRouter
import VueRouter from "vue-router";
// 引入需要的路由组件
import Home from "./views/Home.vue";
import About from "./views/About.vue";
// import List from "./views/List.vue";
import ListTwo from "./views/ListTwo.vue";
import Info from "./views/Info.vue";
import InfoTwo from "./views/InfoTwo.vue";

// 3. Vue.use(VueRouter)
Vue.use(VueRouter);
// 4. 实例化 路由器 实例对象
const router = new VueRouter({
  // 配置选项

  // 路由模式
  //  1 - hash    (默认)
  //  2 - history
  mode: "history",

  // （必须的）路由规则集合
  routes: [
    // 一个对象就表示一个路由
    {
      name: "home", // 命名路由，给路由添加一个名字，后续可以通过该名字来做跳转
      path: "/home", // 路由路径
      component: Home, // 路由组件
    },
    {
      path: "/about",
      component: About,
    },
    {
      path: "/films",
      // component: List,
      component: ListTwo,
    },
    {
      path: "/film",
      component: Info,
    },
    {
      name: "detail",
      path: "/detail/:id",
      component: InfoTwo,
    },
    {
      // 当url路径匹配 /user/任意内容，都可以匹配这条路由
      path: "/user/:xxx",
      component: About,
    },
  ],
});
// 5. 导出
export default router;
